//=====================
// TATEGUMI PROTOTYPE CORE CLASS 
// AKIHIKO TOMOKANE.
//=====================
var Vertical = new Class({
	Implements: [Options, Events],
	options: {
		charMargin: '0.2em',
		colomnMargin: '1em',
		defaultFontSize: '12px'
	},
	
	initialize: function(source, maxNumberOfCharOnColumn, fontSize, options){
		this.setOptions(options);
		
		this.sourceEl = source;
		
		this.source = source.get('text').trim();
		
		this.fontSize;
		
		if(fontSize){
			this.fontSize = fontSize;
		}else{
			this.getFontSizeFromStyleSheet();
		}
		this.fontSize = this.fontSize.toInt();
		
		this.maxNumberOfCharOnColumn = maxNumberOfCharOnColumn;
		
		this.verticalParagraph;
		
		this.column = [];
		
		
		/* exception characters */
		
		this.smallChar = ['ぁ','ぃ','ぅ','ぇ','ぉ','ァ','ィ','ゥ','ェ','ォ','っ','ッ','ゃ','ゅ','ょ','ャ','ュ','ョ'];
		this.literalSymbol = ['、','。'];
		
		/* need rotate characters */
		
		this.needRotateChar = ['(','[','｛','〔','〈','《','「','『','【','〘','〖','〝','‘','“','｟','«',')',']','｝','〕','〉','》','」','』','】','〙','〗','〟','’','”','｠','»','）','（','ー','-'];
		
		/* hyphenation */
		
		this.frontHyphenation = [',',')',']','｝','、','〕','〉','》','」','』','】','〙','〗','〟','’','”','｠','»','ヽ','ヾ','ー','ァ','ィ','ゥ','ェ','ォ','ッ','ャ','ュ','ョ','ヮ','ヵ','ヶ','ぁ','ぃ','ぅ','ぇ','ぉ','っ','ゃ','ゅ','ょ','ゎ','ゕ','ゖ','ㇰ','ㇱ','ㇲ','ㇳ','ㇴ','ㇵ','ㇶ','ㇷ','ㇸ','ㇹ','ㇺ','ㇻ','ㇼ','ㇽ','ㇾ','ㇿ','々','〻','‐','゠','–','〜','?','!','‼','⁇','⁈','⁉','・',':',';','。','.'];
		this.endHyphenation = ['(','[','｛','〔','〈','《','「','『','【','〘','〖','〝','‘','“','｟','«'];
		
		this.convertExceptionSymbol();
		
		
	},
	getFontSizeFromStyleSheet:function(){
		
			if(this.sourceEl.getStyle('font-size')) this.fontSize = this.sourceEl.getStyle('font-size')
			else{
				var tmp = this.sourceEl;
				var i = 0;
			do {
				
				tmp = tmp.getParent();
				this.fontSize = tmp.getStyle('font-size');
				
				i++;
			}while(!this.fontSize && tmp && i <10)
			}
			
			if(!this.fontSize) this.fontSize = this.options.defaultFontSize;
		
	},
	convertExceptionSymbol: function(){
		if (!Browser.Engine.webkit) {
		var covertText = ''
		
			$each(this.source, function(item, index){
				var tmp = '';
				switch (item) {
					case ' ':
						tmp = '';
						break;
					case '-':
						tmp = '|';
						break;
					case ',':
						tmp = '|';
						break;
					case 'ー':
						tmp = '｜';
						break;
					case '（':
						tmp = '⁔';
						break;
					case '）':
						tmp = '‿';
						break;
					default:
						tmp = item;
				}
				
				covertText = covertText + tmp;
				
			})
			
			this.source = covertText;
		}
		this.castVerticalLayout();
	},
	
	castVerticalLayout: function(){
		$each(this.source, function(item, index){
		
				if (index % this.maxNumberOfCharOnColumn == 0) 
				this.column[Math.floor(index / this.maxNumberOfCharOnColumn)] = '';
			
			this.column[Math.floor(index / this.maxNumberOfCharOnColumn)] = this.column[Math.floor(index / this.maxNumberOfCharOnColumn)] + item;
			
		}
		
.bind(this))
		
		this.createElement();
		
	},
	
	createElement: function(){
	
		this.verticalParagraph = new Element(this.sourceEl.get('tag')).setStyles({
			'font-size': this.fontSize + 'px',
			'width': ((1 + this.options.colomnMargin.toInt()) * this.column.length) + 'em'
		});
		
		
		this.column.each(function(item, index){
		
				var chars = new Element('span').setStyles({
				'display': 'block',
				'float': 'right',
				'width': '1em',
				'padding-left': this.options.colomnMargin
			});
			
			$each(item, function(char,index2){
			
						var charEl = new Element('span').setStyles({
					'display': 'block',
					'width': this.fontSize + 'px',
					'height': this.fontSize + 'px',
					'text-align': 'center',
					'margin-bottom': this.options.charMargin
				
				});
				
				charEl = this.castStyleExceptionSymbol(char, charEl);
				
				
				charEl.set('text', char).inject(chars);
				
			}
			
.bind(this))
			
			chars.inject(this.verticalParagraph);
			
		}
		
.bind(this))
		
		var clearEl = new Element('div').setStyle('clear', 'both').inject(this.verticalParagraph);
	},
	
	injectParagraph: function(targetEl){
		this.verticalParagraph.replaces(targetEl);
	},
	
	castStyleExceptionSymbol: function(char, el){
		
		if(this.smallChar.contains(char)){
			el.setStyles({
				'position': 'relative',
				'top':'-0.1em',
				'right':'-0.1em'
			})
		}
		
		
		
		if (this.literalSymbol.contains(char)) {
				el.setStyles({
				'position': 'relative',
				'top': '-' + (this.fontSize * 3 / 4) + 'px',
				'left': (this.fontSize * 3 / 4) + 'px'
			});
		}
		
		
		if (this.needRotateChar.contains(char)) {
				el.addClass('rotateChar');
				el.setStyles({
				'position': 'relative',
				'top': (this.fontSize * 1 / 3) + 'px',
				'left': (this.fontSize * 1 / 3) + 'px'
			});
		}
		
		
		
		return el;
	},
	
	detectExceptionWord: function(char,el){
		
	}
	
	
})
